<template>
	<view>
		<u-navbar :title="title" :title-color="color" :border-bottom="isborder" :back-icon-color="color" :is-back="isback"
			:background="isbg?background:transparent">
			<template slot="right">
				<slot name="right"></slot>
			</template>
		</u-navbar>  
	</view>
</template>

<script>
export default {
	name:"MyTitle",
	props:{ 
		title:{
			type:String,
			default:''
		},
		color:{
			type:String,
			default:'#333'
		},
		isback:{
			type:Boolean,
			default:true
		},
		isbg:{
			type:Boolean,
			default:true
		},
		isborder:{
			type:Boolean,
			default:false
		},
		transparent:{
			type:Object,
			default(){
				return{
					'backgroundColor': 'transparent'
				}
			}
		},
		background:{
			type:Object,
			default() {
				return {
					'backgroundColor':'#fff'
					//'backgroundImage': 'linear-gradient(44deg , #1EA4EB 0%, #77FDD9 100%)', 
				// 'background': 'url('+require('../static/img/bg/icon_nav_bg.png')+') no-repeat  center/100% 100%', 
				// css——background属性设置background-size
				// 搬运自：https://juejin.cn/post/6844903463273381901
				
				// background简写属性在一个声明中可设置所有的背景属性。
				
				// 可设置属性如下:
				
				// background-image: 设置背景图像, 可以是真实的图片路径, 也可以是创建的渐变背景;
				// background-position: 设置背景图像的位置;
				// background-size: 设置背景图像的大小;
				// background-repeat: 指定背景图像的铺排方式;
				// background-attachment: 指定背景图像是滚动还是固定;
				// background-origin: 设置背景图像显示的原点[background-position相对定位的原点];
				// background-clip: 设置背景图像向外剪裁的区域;
				// background-color: 指定背景颜色。
				
				// 简写的顺序如下: bg-color || bg-image || bg-position [ / bg-size]? || bg-repeat || bg-attachment || bg-origin || bg-clip
				
				// 顺序并非固定, 但是要注意:
				
				// background-position 和 background-size 属性, 之间需使用/分隔, 且position值在前, size值在后。
				// 如果同时使用 background-origin 和 background-clip 属性, origin属性值需在clip属性值之前, 如果origin与clip属性值相同, 则可只设置一个值
				}
			}
		}
	},
	data() {
		return { 
		};
	}
}
</script>

<style lang="scss" scoped>
/deep/ .u-slot-right{
	margin-right:35rpx;
}
</style>